<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>练习项目01</title>
    <link rel="stylesheet" href="./index.css">
</head>

<body>
    <div class="container">
        <header>
            <img src="./logo.png" alt="">
            <nav>
                <a href="">首页</a>
                <a href="">笔记
                    <ul>
                        <li>随笔</li>
                    </ul>
                </a>
                <a href="">工具</a>
                <button class="btn">源码</button>
            </nav>
        </header>
        <main>
            <div class="mainLeft">
                <h1 class="headerline">对未来的展望</h1>
                <p class="descrip">记录前端学习过程中的知识</p>
                <button class="btn">记录</button>
            </div>
            <div class="mainRight">
                <img src="./bg.png" alt="">
            </div>
        </main>
        <footer>
            <div class="socialMedia">
                <img src="./微信.png" alt="">
                <img src="./github.png" alt="">
                <img src="./bilibili.png" alt="">
            </div>
        </footer>
    </div>
</body>

</html>